﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Menu.aspx.cs" Inherits="MagicBag.CRM.Web.Admin.Menu" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        *
        {
            font-size: 12px;
        }
        #SearchBar
        {
            margin-bottom: 5px;
        }
        
        #fm
        {
            margin: 0;
            padding: 10px 30px;
        }
        .ftitle
        {
            font-size: 14px;
            font-weight: bold;
            color: #666;
            padding: 5px 0;
            margin-bottom: 10px;
            border-bottom: 1px solid #ccc;
        }
        .fitem
        {
            margin-bottom: 5px;
        }
        .fitem label
        {
            display: inline-block;
            width: 80px;
        }
    </style>
    <link href="../Script/jquery-easyui/themes/default/easyui.css" rel="stylesheet" type="text/css" />
    <link href="../Script/jquery-easyui/themes/icon.css" rel="stylesheet" type="text/css" />
    <script src="../Script/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="../Script/jquery-easyui/jquery.easyui.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        function Append() {
            var node = $('#tt2').tree('getSelected');
            var parentID = 0;
            if (node != null)
                parentID = node.id;


            $('#dlg').dialog('open').dialog('setTitle', '新增');
            $('#fm').form('clear');
            url = 'MagicBag.CRM.Service/MenuService.crm?act=Insert';

            $('#cc').combobox({
                url: 'MagicBag.CRM.Service/MenuService.crm?act=GetMenus&ddl=1',
                valueField: 'id',
                textField: 'text'
            });

            if (node)
                $("#cc").combobox("setValue", node.id);
        }

        function Remove() {
            // var row = $('#tt').datagrid('getSelected');
            var node = $('#tt2').tree('getSelected');
            if (node == null) {
                $.messager.alert("错误", "请选择要删除的项！", "error");
                return;
            }
            var nodes = $.merge($('#tt2').tree('getChildren', node.target), [node]); //合并当前结点及子结点

            if (nodes.length > 0) {
                $.messager.confirm('确认', '您确定要删除此菜单吗？其所有子菜单也将全部删除！', function (r) {
                    if (r) {
                        $(nodes).each(function () {
                            $.post('MagicBag.CRM.Service/MenuService.crm?act=Delete', { id: $(this)[0].id }, function (result) {
                                if (result.Success) {
                                    $('#tt2').tree('reload'); // reload the user data
                                } else {
                                    $.messager.show({	// show error message
                                        title: 'Error',
                                        msg: result.Msg
                                    });
                                }
                            }, 'json');

                        });

                    }
                });
            }
        }

        function Edit() {
            var node = $('#tt2').tree('getSelected'); //getParent
            if (node == null) {
                $.messager.alert("错误", "请选择要修改的项！", "error");
                return;
            }
            var parent = $('#tt2').tree('getParent', node.target);
            var pid = parent == null ? 0 : parent.id;
            if (node) {
                $('#dlg').dialog('open').dialog('setTitle', '修改');

                // $('#fm input[name="Category"]').combobox({

                $('#cc').combobox({
                    url: 'MagicBag.CRM.Service/MenuService.crm?act=GetMenus&ddl=1',
                    valueField: 'id',
                    textField: 'text'
                });


                $('#fm').form('load', {
                    ID: node.id,
                    Name: node.text,
                    ParentID: pid,
                    Location: node.attributes.location,
                    Remark: node.attributes.remark
                });
                $("#cc").combobox("setValue", pid);

                url = 'MagicBag.CRM.Service/MenuService.crm?act=Update';
            }
        }

        function Save() {
            $('#fm').form('submit', {
                url: url,
                onSubmit: function () {
                    return $(this).form('validate');
                },
                success: function (result) {
                    var result = eval('(' + result + ')');
                    if (result.Success) {
                        $('#dlg').dialog('close'); 	// close the dialog
                        $('#tt2').tree('reload'); // reload the user data
                    } else {
                        $.messager.alert("错误", result.Msg, "error");
                    }
                }
            });
        }

        //        $(function () {
        //            $("#toolbar").toolbar();
        //        });
    </script>
</head>
<body>
    <div style="border: 1px dashed gray; padding: 5px; margin-bottom: 5px;">
        <font color="red">说明：</font>使用右键也可以新增菜单，修改菜单和删除菜单</div>
    <div id="toolbar1" class="easyui-toolbar">
        <div style="background: #fafafa; padding: 5px; border: 1px solid #ddd">
            <a href="#" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-add'"
                onclick="Append();">新增</a> <a href="#" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-edit'"
                    onclick="Edit();">修改</a> <a href="#" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-remove'"
                        onclick="Remove();">删除</a>
        </div>
    </div>
    </div>
    <ul id="tt2" style="padding: 10px;" class="easyui-tree" data-options="url:'MagicBag.CRM.Service/MenuService.crm?act=GetMenus',checkbox:false,
			onClick: function(node){
				$(this).tree('toggle', node.target);
			},
			onContextMenu: function(e,node){
				e.preventDefault();
				$(this).tree('select',node.target);
				$('#mm').menu('show',{
					left: e.pageX,
					top: e.pageY
				});
			}">
    </ul>
    <div id="mm" class="easyui-menu" style="width: 120px;">
        <div onclick="Append()" data-options="iconCls:'icon-add'">
            新增</div>
        <div onclick="Edit()" data-options="iconCls:'icon-edit'">
            修改</div>
        <div onclick="Remove()" data-options="iconCls:'icon-remove'">
            删除</div>
        <div class="menu-sep">
        </div>
        <div onclick="expand()">
            展开</div>
        <div onclick="collapse()">
            折叠</div>
    </div>
    <!--对话框-->
    <div id="dlg" class="easyui-dialog" style="width: 500px; height: 400px; padding: 10px 20px"
        closed="true" buttons="#dlg-buttons">
        <div class="ftitle">
            菜单信息</div>
        <form id="fm" method="post" novalidate>
        <div class="fitem">
            <input name="ID" type="hidden" readonly="readonly" />
        </div>
        <div class="fitem">
            <label>
                所属菜单:</label>
            <input id="cc" name="ParentID" class="easyui-combobox" style="width: 150px;" />
        </div>
        <div class="fitem">
            <label>
                菜单名称:</label>
            <input name="Name" class="easyui-validatebox" required="true" />
        </div>
        <div class="fitem">
            <label>
                链接地址:</label>
            <input name="Location" size="40" maxlength="1000" />
        </div>
        <div class="fitem">
            <label>
                备注:</label>
            <textarea rows="10" cols="30" name="Remark"></textarea>
        </div>
        </form>
    </div>
    <div id="dlg-buttons">
        <a href="#" class="easyui-linkbutton" iconcls="icon-ok" onclick="Save()">保存</a>
        <a href="#" class="easyui-linkbutton" iconcls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">
            取消</a>
    </div>
</body>
</html>
